<template>
	<el-dialog v-model="dialog" :title="!state.form.id ? '新增' : '修改'" width="60%" :before-close="handleClose">
		<el-form ref="formRef" :model="state.form" :rules="state.rules" label-width="120px" @keyup.enter="submitForm(formRef)" status-icon>
	    				<el-form-item label="主键" prop="id">
					<el-input v-model="state.form.id" placeholder="主键"></el-input>
				</el-form-item>
				<el-form-item label="配送单号" prop="distributionNo">
					<el-input v-model="state.form.distributionNo" placeholder="配送单号"></el-input>
				</el-form-item>
				<el-form-item label="配送方式(0：未指派配送，1：达达配送，2：门店配送)" prop="distributionWay">
					<el-input v-model="state.form.distributionWay" placeholder="配送方式(0：未指派配送，1：达达配送，2：门店配送)"></el-input>
				</el-form-item>
				<el-form-item label="配送状态(1：待接单，2：待取货，3：配送中，4：已完成，5：已取消，7：已过期，8：指派单，9：妥投异常之物品返回中，10：妥投异常之物品返回完成，1000：创建运单失败)" prop="distributionStatus">
					<el-input v-model="state.form.distributionStatus" placeholder="配送状态(1：待接单，2：待取货，3：配送中，4：已完成，5：已取消，7：已过期，8：指派单，9：妥投异常之物品返回中，10：妥投异常之物品返回完成，1000：创建运单失败)"></el-input>
				</el-form-item>
				<el-form-item label="骑手id" prop="riderId">
					<el-input v-model="state.form.riderId" placeholder="骑手id"></el-input>
				</el-form-item>
				<el-form-item label="骑手名字" prop="riderName">
					<el-input v-model="state.form.riderName" placeholder="骑手名字"></el-input>
				</el-form-item>
				<el-form-item label="骑手电话" prop="riderTel">
					<el-input v-model="state.form.riderTel" placeholder="骑手电话"></el-input>
				</el-form-item>
				<el-form-item label="配送距离" prop="distributionDistance">
					<el-input v-model="state.form.distributionDistance" placeholder="配送距离"></el-input>
				</el-form-item>
				<el-form-item label="配送运费" prop="distributionFee">
					<el-input v-model="state.form.distributionFee" placeholder="配送运费"></el-input>
				</el-form-item>
				<el-form-item label="第三方配送运费扣款时间" prop="consumeTime">
					<el-input v-model="state.form.consumeTime" placeholder="第三方配送运费扣款时间"></el-input>
				</el-form-item>
				<el-form-item label="预计配送用时" prop="predictTime">
					<el-input v-model="state.form.predictTime" placeholder="预计配送用时"></el-input>
				</el-form-item>
				<el-form-item label="配送开始时间" prop="startAt">
					<el-input v-model="state.form.startAt" placeholder="配送开始时间"></el-input>
				</el-form-item>
				<el-form-item label="配送结束时间" prop="endAt">
					<el-input v-model="state.form.endAt" placeholder="配送结束时间"></el-input>
				</el-form-item>
				<el-form-item label="超时:0未超时 1超时" prop="overtime">
					<el-input v-model="state.form.overtime" placeholder="超时:0未超时 1超时"></el-input>
				</el-form-item>
				<el-form-item label="创建时间" prop="createTime">
					<el-input v-model="state.form.createTime" placeholder="创建时间"></el-input>
				</el-form-item>
				<el-form-item label="更新时间" prop="updateTime">
					<el-input v-model="state.form.updateTime" placeholder="更新时间"></el-input>
				</el-form-item>
				<el-form-item label="逻辑删除：0.显示；1.隐藏；" prop="delFlag">
					<el-input v-model="state.form.delFlag" placeholder="逻辑删除：0.显示；1.隐藏；"></el-input>
				</el-form-item>
				<el-form-item label="租户id" prop="tenantId">
					<el-input v-model="state.form.tenantId" placeholder="租户id"></el-input>
				</el-form-item>
				<el-form-item label="创建人" prop="createBy">
					<el-input v-model="state.form.createBy" placeholder="创建人"></el-input>
				</el-form-item>
				<el-form-item label="修改人" prop="updateBy">
					<el-input v-model="state.form.updateBy" placeholder="修改人"></el-input>
				</el-form-item>
		</el-form>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="handleClose">关 闭</el-button>
				<el-button type="primary" :loading="loading" @click="submitForm(formRef)">确 认</el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import { ElMessage,FormInstance } from 'element-plus'
import { addObj, editObj, getById } from '/@/api/cloud/distribution_order_detail'
const emit = defineEmits(['initPage']);
const state = reactive({
	form: {
		id: '',
		distributionNo: '',
		distributionWay: '',
		distributionStatus: '',
		riderId: '',
		riderName: '',
		riderTel: '',
		distributionDistance: '',
		distributionFee: '',
		consumeTime: '',
		predictTime: '',
		startAt: '',
		endAt: '',
		overtime: '',
		createTime: '',
		updateTime: '',
		delFlag: '',
		tenantId: '',
		createBy: '',
		updateBy: ''	},
	rules: {
	},
})


const dialog = ref(false);
const loading = ref(false);
const formRef = ref();

const initForm = (row: any | undefined) => {
	dialog.value = true;
	if (row && row.id) {
		getDetail(row.id);
	}
};

const getDetail = (id: string) => {
	loading.value = true;
	getById(id).then((response: any) => {
		state.form = response.data.data;
		loading.value = false;
	});
};

/**
 * 关闭事件
 */
const handleClose = () => {
	resetForm(formRef.value);
};

/**
 * 重置表单
 */
const resetForm = (formEl: FormInstance | undefined) => {
	if (!formEl) return;
	state.form.id = '';
	loading.value = false;
	dialog.value = false;
	formEl.resetFields();
};


/**
 * 提交按钮
 */
const submitForm = async (formEl: FormInstance | undefined) => {
	if (!formEl) return;
	await formEl.validate((valid) => {
		if (valid) {
			loading.value = true;
			if (state.form.id) {
				//修改
				edit();
			} else {
				//新增
				add();
			}
		}
	});
};
/**
 * 新增
 */
const add = () => {
	addObj(state.form)
			.then(() => {
				resetForm(formRef.value);
				ElMessage.success('新增成功');

				emit('initPage');
			})
			.catch(() => {
				loading.value = false;
			});
};
/**
 * 修改
 */
const edit = () => {
	editObj(state.form)
			.then(() => {
				resetForm(formRef.value);
				ElMessage.success('修改成功');
				emit('initPage');
			})
			.catch(() => {
				loading.value = false;
			});
};

defineExpose({
	initForm
})
</script>
